﻿<MCard Flat
       Color="transparent">
    <MSubheader>Media volume</MSubheader>
    <MCardText>
        <MSlider @bind-Value="_media"
                 PrependIcon="mdi-volume-high"></MSlider>
    </MCardText>

    <MSubheader>Alarm volume</MSubheader>

    <MCardText>
        <MSlider @bind-Value="_alarm"
                 AppendIcon="mdi-alarm"></MSlider>
    </MCardText>

    <MSubheader>Icon click callback</MSubheader>

    <MCardText>
        <MSlider @bind-Value="_zoom"
                 AppendIcon="mdi-magnify-plus-outline"
                 PrependIcon="mdi-magnify-minus-outline"
                 OnAppendClick="ZoomIn"
                 OnPrependClick="ZoomOut"></MSlider>
    </MCardText>
</MCard>

  @code {
    private double _media = 0;
    private double _alarm = 0;
    private double _zoom = 0;

    private void ZoomOut()
    {
        _zoom = _zoom - 10;
        if (_zoom < 0)
        {
            _zoom = 0;
        }
    }

    private void ZoomIn()
    {
        _zoom = _zoom + 10;
        if (_zoom > 100)
        {
            _zoom = 100;
        }
    }
  }